<template>
  <div class="dljjc_box3_x" style="min-height: 100vh">
    <m-win
      v-model:window_open="val.addtop1win"
      :title="`添加${cfg.route.query.tab}队榜一队伍`"
    >
      <template #content>
        <div class="stitle">· 投稿信息 ·</div>
        <div class="_box0">
          <n-grid
            x-gap="8"
            y-gap="8"
            :cols="parseInt(cfg.sswd / 350) >= 2 ? 2 : parseInt(cfg.sswd / 350)"
          >
            <n-gi span="2">
              <div
                style="
                  background-color: var(--banr-bg);
                  padding: 10px 8px;
                  border-radius: 3px;
                  display: flex;
                  align-items: center;
                  gap: 8px;
                  flex-direction: column;
                "
              >
                <m-role
                  :showwepon="true"
                  :ban="['ghz']"
                  :maxlimit="4"
                  :data="val.roledata"
                  :listname="['主控', 'AI', 'AI', 'AI']"
                ></m-role>
              </div>
            </n-gi>
          </n-grid>
        </div>
      </template>
      <template #footer>
        <n-button type="gt_y" :size="cfg.sizebtn" @click="ct.subaddtop1"
          >提交队伍</n-button
        >
      </template>
    </m-win>
    <m-win
      v-model:window_open="val.addendwin"
      :title="`添加${cfg.route.query.tab}队垫底队伍`"
    >
      <template #content>
        <div class="stitle">· 投稿信息 ·</div>
        <div class="_box0">
          <n-grid
            x-gap="8"
            y-gap="8"
            :cols="parseInt(cfg.sswd / 350) >= 2 ? 2 : parseInt(cfg.sswd / 350)"
          >
            <n-gi span="2">
              <div
                style="
                  background-color: var(--banr-bg);
                  padding: 10px 8px;
                  border-radius: 3px;
                  display: flex;
                  align-items: center;
                  gap: 8px;
                  flex-direction: column;
                "
              >
                <m-role
                  :showwepon="true"
                  :ban="['ghz']"
                  :maxlimit="4"
                  :data="val.roledata"
                  :listname="['主控', 'AI', 'AI', 'AI']"
                ></m-role>
              </div>
            </n-gi>
          </n-grid>
        </div>
      </template>
      <template #footer>
        <n-button type="gt_y" :size="cfg.sizebtn" @click="ct.subaddend"
          >提交队伍</n-button
        >
      </template>
    </m-win>
    <m-win
      v-model:window_open="val.topupdwin"
      :title="`替换${cfg.route.query.tab}队榜${val.updtop}队伍(原队伍排名-1)`"
    >
      <template #content>
        <div class="stitle">· 投稿信息 ·</div>
        <div class="_box0">
          <n-grid
            x-gap="8"
            y-gap="8"
            :cols="parseInt(cfg.sswd / 350) >= 2 ? 2 : parseInt(cfg.sswd / 350)"
          >
            <n-gi span="2">
              <div
                style="
                  background-color: var(--banr-bg);
                  padding: 10px 8px;
                  border-radius: 3px;
                  display: flex;
                  align-items: center;
                  gap: 8px;
                  flex-direction: column;
                "
              >
                <m-role
                  :showwepon="true"
                  :ban="['ghz']"
                  :maxlimit="4"
                  :data="val.roledata"
                  :listname="['主控', 'AI', 'AI', 'AI']"
                ></m-role>
              </div>
            </n-gi>
          </n-grid>
        </div>
      </template>
      <template #footer>
        <n-button type="gt_y" :size="cfg.sizebtn" @click="ct.subupdteam"
          >替换队伍</n-button
        >
      </template>
    </m-win>

    <m-tabs :value="val.tab" :data="val" @update:value="ct.tabhand" :list="ct.tablist" />
    <n-button @click="ct.editswitch">编辑模式</n-button>
    <div v-if="val.editswitch">
      <div><n-button @click="ct.addtop1">添加榜一队伍</n-button></div>
      <div><n-button @click="ct.addend">添加垫底队伍</n-button></div>
    </div>
    <div>
      <div v-for="item in val.list">
        <div v-if="val.editswitch">
          <n-button @click="ct.topupd(item.top)">添加到榜{{ item.top }}</n-button>
          <n-button @click="ct.updteam(item.top)">编辑</n-button>
        </div>
        <template v-for="item2 in item.role">
          <img :src="cfg.function.ava(item2, 60)" />
        </template>
      </div>
    </div>
  </div>
</template>
<script>
import { cfg } from "@/cfg/cfg.js";
export default {
  setup() {
    const ct = {
      //编辑模式开关
      editswitch: () => {
        if (val.editswitch) {
          val.editswitch = false;
        } else {
          val.editswitch = true;
        }
      },
      //替换队伍
      subupdteam: async () => {
        let res = await cfg.axios.get(`${cfg.url}`, {
          params: {
            t: "v2/get",
            t2: "introduction/raids_qly",
            t3: "updteam",
            elemental: cfg.route.query.tab,
            data: val.roledata,
            top: val.updtop,
            uid: cfg.user.uid,
            authkey: cfg.user.authkey,
          },
        });
      },
      //提交榜一队伍
      subaddtop1: async () => {
        let res = await cfg.axios.get(`${cfg.url}`, {
          params: {
            t: "v2/get",
            t2: "introduction/raids_qly",
            t3: "addtop1",
            elemental: cfg.route.query.tab,
            data: val.roledata,
            uid: cfg.user.uid,
            authkey: cfg.user.authkey,
          },
        });
      },
      //提交垫底队伍
      subaddend: async () => {
        let res = await cfg.axios.get(`${cfg.url}`, {
          params: {
            t: "v2/get",
            t2: "introduction/raids_qly",
            t3: "addend",
            elemental: cfg.route.query.tab,
            data: val.roledata,
            uid: cfg.user.uid,
            authkey: cfg.user.authkey,
          },
        });
      },

      //替换排名窗口
      topupd: (top) => {
        val.topupdwin = true;
        val.roledata = [];
        val.updtop = top;
      },
      //弹出添加榜一队伍窗口
      addtop1: () => {
        val.addtop1win = true;
        val.roledata = [];
      },
      //弹出添加垫底队伍窗口
      addend: () => {
        val.addendwin = true;
        val.roledata = [];
      },
      tabhand: async (id, data) => {
        data.tab = id;
        cfg.router.push({
          query: {
            ...cfg.route.query,
            tab: data.tab ?? null,
          },
        });

        let res = await cfg.axios.get(`${cfg.url}`, {
          params: {
            t: "v2/get",
            t2: "introduction/raids_qly",
            t3: "select",
            elemental: data.tab,
          },
        });
        val.list = res.data.data;
      },
      comp: {},
      deftab: "ghz",
      tablist: [
        { name: "火", title: "火队" },
        { name: "水", title: "水队" },
        { name: "土", title: "土队" },
        { name: "光", title: "光队" },
        { name: "暗", title: "暗队" },
        { name: "虚", title: "虚队" },
        { name: "通", title: "无克制队" },
      ],
    };
    const val = reactive({
      editswitch: false,
      addtop1win: false,
    });
    onMounted(async () => {});
    return { cfg, ct, val };
  },
};
</script>
